<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
  
  <link rel="stylesheet" href="/EDFU/css/slick/slick.grid.css" type="text/css"/>
  <link rel="stylesheet" href="/EDFU/css/slick/smoothness/jquery-ui-1.8.16.custom.css" type="text/css"/>
  <link rel="stylesheet" href="/EDFU/css/style.css" type="text/css"/>
  
   <link rel="stylesheet" href="/EDFU/css/jquery-ui-1.8.17.custom.css" type="text/css"/>



</head>
<body>



<style type="text/css">
			.listCont { width : 100%;margin: 0;}
			   	
		</style>

<div id="content"		
<h1>Available Test Bundles </h1>
<div id="wrapper">
<div id="steps">		
	<div id="myGrid" class = "listCont"></div>
	<button id="createTB" class="buttonDef">ADD NEW</button>

</div>
</div>
</div>

<div id="dialog-add-questions" title="Add Questions">
	
</div>

    

<script src="../js/jquery-1.7.1.js"></script>
<script src="../js/jquery.event.drag-2.0.min.js"></script>

<script src="/EDFU/js/slick/slick.core.js"></script>
<script src="/EDFU/js/slick/slick.grid.js"></script>
<script src="/EDFU/js/slick/slick.formatters.js"></script>
<script src="/EDFU/js/jquery-ui-1.8.16.custom.js"></script>



<script>


  var grid;
  var columns = [
    {id: "code", name: "Code", field: "code"},
    {id: "name", name: "Name", field: "name"},
    {id: "publisher", name: "Publisher", field: "publisher"},
    {id: "desc", name: "Description", field: "desc"},
	{id: "actions", name: "Actions", field: "actions", formatter: Slick.Formatters.Actions},

	
	 

   ];

  var options = {
    autoWidth:true,
	autoHeight: true,
    enableCellNavigation: true,
    enableColumnReorder: false,
	forceFitColumns : true
  };
  var debug;
  
  

 $(function () {
    var data = [];
    for (var i = 0; i < 5; i++) {
      data[i] = {
        code: "TEST-50" + i,
        name: "Automate",
        publisher: "SK & Companyhoo",
        desc: "First Test",
        actions: "",
        
      };
    }
	    grid = new Slick.Grid("#myGrid", data, columns, options);
		
		$('.action').click(function(event)
		{
			var code = event.target.parentElement.parentElement.parentElement.children[0].innerHTML;
			alert("hi");
			$("#dialog-add-questions").html('<iframe id="testFrame" src="addQuestions.html?code=' + code + '" height="100%" width="100%" ></iframe>');
		//	$("#testFrame").src = $("#testFrame").src + "?code=" + code;
			$( "#dialog-add-questions" ).dialog("open");
			
		});
			//alert(code);
		

	});
	
	$( "#dialog-add-questions" ).dialog({
					autoOpen: false,
					height: 500,
					width: 800,
					modal: true,
					
					close: function() {
					}
				});
	
	

	
  
</script>
</body>
</html>